import React, { useState } from 'react'
import { ArrowLeft, Find } from '@nutui/icons-react';
import { Steps, Step, Button } from '@nutui/nutui-react'
import '@nutui/nutui-react/dist/style.css'
import axios from 'axios'
import { useNavigate } from 'react-router-dom';
import MyHouse_information from '../../Components/MyHouse_information/MyHouse_information';
import Owner_information from '../../Components/Owner_information/Owner_information'
import { json } from 'react-router-dom';

const amapSecurityConfigScript = document.createElement('script');
amapSecurityConfigScript.type = 'text/javascript';
amapSecurityConfigScript.innerHTML = `window._amapsecurityconfig = { securityjscode: 'd3258bbb54a2df81188aa8008dcc4374' };`;
document.head.appendChild(amapSecurityConfigScript);

export default function MyRentalHousing() {
  const navigate = useNavigate()
  const [val, setVal] = useState(1);
  const handleStep = async (isObj) => {
    console.log('isObjc:',isObj)
    console.log(JSON.parse(sessionStorage.getItem('user')))
    isObj.owner = JSON.parse(sessionStorage.getItem('user')).username
    let res = await axios.post('http://localhost:3000/jwh/addMyRoom', { isObj })
    let { code, msg } = res.data;
    if (code === 200) {
      const newVal = (val % 3) + 1;
      setVal(newVal);
    }
    navigate('/MyHouse')
  }
  return (
    <div>
      <div className='MyHouse'>
        <div className='MyHouse_top'>
          <ArrowLeft className="back-icon" width={"40px"} onClick={() => window.history.back()} />
          <span className="title-text">添加房屋</span>
        </div>
        <div className='MyHouse_content'>
          <Steps value={val}>
            <Step value={1} title="房屋信息" />
            <Step value={2} title="物业审核" />
            <Step value={3} title="认证成功" />
          </Steps>

          <MyHouse_information handleStep={(isObj) => handleStep(isObj)} style={{display:val == 1 ? '':'none'}}></MyHouse_information>
          <Owner_information></Owner_information>
        </div>
      </div>
    </div>
  )
}
